<template>
	<view v-if="dashang.dashang_kaiguan==0" class="d-kuan d-juzhong">
		<uv-overlay :show="show" @click="close" zIndex="999">
			
			<view class="warp">
				
				<view class="rect" @tap.stop>
  					<image @click="d_dashang()" src="/static/img/dashang.png" mode="aspectFill" class="d-img-50 floating-image"></image>
					<view class="title">
						{{ title }}
					</view>
					
					<view class="amount">¥{{ calculatedAmount.toFixed(2) }}</view>
					<!--view class="d-juzhong d-wenzi-14">支付ID:{{payid}}</view-->
					
					<view class="d-kuan amount-buttons">
						<!-- 6个打赏金额，三个一行 -->
						<view class="amount-row">
							<view 
								v-for="(amount, index) in rewardAmounts.slice(0, 3)" 
								:key="index"
								class="amount-button"
								:class="{ active: calculatedAmount == amount }"
								@click="selectAmount(amount)"
							>
								¥{{ amount }}
							</view>
						</view>
						<view class="amount-row">
							<view 
								v-for="(amount, index) in rewardAmounts.slice(3)" 
								:key="index + 3"
								class="amount-button"
								:class="{ active: calculatedAmount == amount }"
								@click="selectAmount(amount)"
							>
								¥{{ amount }}
							</view>
						</view>
					</view>
					<view class="input-container">
						
						<uv-input
						    v-if="mark == 'tie' || mark == 'ping'"
							v-model="inputAmount"
							type="number"
							placeholder="请输入打赏金额"
							customStyle="width: 200rpx; text-align: right;"
							@dblclick="clearInputAmount"
						/>
					</view>
					<!--view v-if="zhifu_tishi && zhifu_tishi !== '' && erweima == ''" class="erweima" >
						<view class="pay-type-hongse">{{zhifu_tishi}}</view>
					</view-->
					<view v-if="erweima && erweima !== ''" class="erweima" style="display: flex; flex-direction: column; align-items: center; justify-content: center;">
						<image :src="erweima" style="width: 210px; height: 210px;" />
						<view class="pay-type">请使用微信扫描二维码</view>
					</view>
					<view v-if="dayu == true" class="d-juzhong d-wenzi-14 d-xia-10" style="color: #b6b6b6;" >打赏金额不能小于{{ this.dashang.dashang_xianzhi_rmb }}元</view>
					<view v-if="cuowu == true" class="d-juzhong d-wenzi-14 d-xia-10" style="color: #b6b6b6;" >{{ cuowu_tishi }}</view>
					<view class="buttons">
						
						<uv-button v-if="mark == 'recharge'" type="primary" @click="handlePay" :disabled="!isAmountValid">确定打赏</uv-button>
						<uv-button v-else-if="mark == 'score'" type="primary" @click="handlePay" :disabled="!isAmountValid">确定打赏</uv-button>
						<uv-button v-else type="primary" @click="handlePay" :disabled="!isAmountValid">确认打赏</uv-button>
						<uv-button type="default" @click="close">取消</uv-button>
					</view>
					<!--view class="pay-type">支付方式: {{ payType === 'weixin' ? '微信支付' : '支付宝' }}</view-->
				</view>
			</view>
		</uv-overlay>
	</view>
</template>
<script>
import { getRequest,postRequest } from '@/utils/wxRequest.js'
import Api from '@/utils/api.js'
import Quan_Api from '@/utils/quan_api.js'
import Dashang_Api from '@/utils/dashang_api.js' // 打赏接口
//import duixin from '@/utils/config.js'

export default {
  name: 'Dzhifu',
  props: {
    // 控制组件显示/隐藏
    show: {
      type: Boolean,
      default: false
    },
    // 支付标题
    title: {
      type: String,
      default: '打 赏'
    },
    // 支付类型
    payType: {
      type: String,
      default: 'weixin'
    },
	// 充值金额（支持正负数，字符串或数字）
	jine: {
      type: [Number, String],
      default: 0
    },
	// 支付ID
	payid: {
      type: String,
      default: ''
    },
	// 自定义参数
	mark: {
      type: String,
      default: ''
    },
	// 圈子id
	quanid: {
      type: Number,
      default: 0
    },
	// 积分数据
	jifen_data: {
      type: Object,
      default: () => ({})
    },
	id: {
      type: Number,
      default: 0
    },
	// 评论id
	pinglun_id: {
      type: Number,
      default: 0
    },
  },
  // 组件挂载时执行
  mounted() {
    //console.log('d-zhifu组件已挂载，jine初始值:', this.jine, '类型:', typeof this.jine);
	this.getDashang(); // 获取打赏设置
	this.getUidlist(); // 获取打赏用户列表
  },
  
  watch: {
    // 监听jine属性，当jine变化时触发（支持正负数）
    jine: {
      immediate: true, // 组件加载时立即执行一次
      handler(newVal) {
        // jine可以是数字或字符串，这里统一转为数字
        const numVal = Number(newVal);
        if (!isNaN(numVal)) {
            if (numVal === 0) {
              this.inputAmount = '';
              this.zhifu_tishi = '';
            } else {
              this.inputAmount = Math.abs(numVal).toString();
              //this.zhifu_tishi = '充值' + Math.abs(numVal) + '元';
			  if(this.mark == 'recharge'){
				
				this.zhifu_tishi = (numVal > 0 ? '充值' : '扣减') + Math.abs(numVal) + '元';
			  } else {
				this.zhifu_tishi = '支付' + Math.abs(numVal) + '元';
			  }
            }
          }
      }
    },
    // 监听show属性变化，当组件从隐藏变为显示时，重新根据jine设置金额（支持正负数）
    show: {
      handler(newValue) {
        if (newValue) {
          const numVal = Number(this.jine);
          if (!isNaN(numVal)) {
            if (numVal === 0) {
              this.inputAmount = '';
              this.zhifu_tishi = '';
            } else {
              this.inputAmount = Math.abs(numVal).toString();
              //this.zhifu_tishi = '充值' + Math.abs(numVal) + '元';
			    if(this.mark == 'recharge'){
				    this.zhifu_tishi = (numVal > 0 ? '充值' : '扣减') + Math.abs(numVal) + '元';
				} else if(this.mark == 'score'){
					this.zhifu_tishi = '支付' + Math.abs(numVal) + '元';
				}  else {
					this.zhifu_tishi = '支付' + Math.abs(numVal) + '元';
				}
            }
          }
        }
      }
    }
  },
  data() {
    return {
      inputAmount: '', // 用户输入的金额
      queryInterval: null, // 存储支付查询轮询的定时器ID
	  erweima:'',
	  zhifu_tishi:'',
	  rewardAmounts: [], // 打赏金额选项
	  dashang: {}, //打赏设置数据 dashang
	  dayu: false, // 打赏金额是否大于等于最小金额
	  cuowu: false, // 错误提示
	  cuowu_tishi:'', // 错误提示
	  
    };
  },
  computed: {
	yidenglu() {
	    return (this.$store.state.memberuid && this.$store.state.keycode) ? 1 : 0;
	  },
	  keycode() {
	    return this.$store.state.keycode;
	  },
	  uid() {
	    return this.$store.state.memberuid;
	  },
	  touxiang() {
	    return this.$store.state.member? this.$store.state.member.avatar : '';
	  },
	  name1() {
		const member = this.$store.state.member;
    	if (!member) return '';
    	return member.name || member.uname || member.username || '';
	    //return this.$store.state.member? this.$store.state.member.name : '';
	  },
    // 计算实际金额
    calculatedAmount() {
      const num = Number(this.inputAmount);
      return isNaN(num) ? 0 : num;
    },
    // 验证金额是否有效（允许正负，排除0）
    isAmountValid() {
      return this.calculatedAmount !== 0;
    }
  },
  
  methods: {
    // 关闭组件
      close() {
        // 停止支付查询轮询
        if (this.queryInterval) {
          clearInterval(this.queryInterval);
          this.queryInterval = null;
        }
		this.inputAmount = '';
        // 清除二维码数据
        this.erweima = '';
        this.$emit('close');
		this.cuowu = false;
		this.cuowu_tishi = '';
      },
    // 处理支付
    handlePay() {
      if (!this.isAmountValid) {
        uni.showToast({
      	    title: '请输入有效的充值金额',
      	    icon: 'none'
      	  });
      	  return;
      	}
		// 判断输入的金额是否大于打赏设置的最大金额
        if(this.calculatedAmount < this.dashang.dashang_xianzhi_rmb){
        	//console.log('this.calculatedAmount',this.calculatedAmount);
        	//console.log('this.dashang.dashang_xianzhi_rmb',this.dashang.dashang_xianzhi_rmb);
        	this.dayu = true;
        	  return;
        }
		  // 触发支付事件，将支付信息传递给父组件
		  this.$emit('pay', {
			amount: this.calculatedAmount,
			title: this.title,
			payType: this.payType
		  });
		  //提交支付
		  // #ifdef H5
		  	const userAgent = navigator.userAgent.toLowerCase();
		  	if (/ipad|iphone|midp|rv:1.2.3.4|ucweb|android/.test(userAgent)) {
			// 移动端
			    //判断是否在微信浏览器中
                if(/micromessenger/.test(userAgent)){
					// 微信浏览器中
                    //弹出提示，加载中...
						uni.showToast({
							title: '加载中...',
							icon: 'loading',
							duration: 4000
						});
						this.postdashang_api();
						return;
				} else {
					// 显示弹窗
					this.postchongzhi_api();
					return;
				}
            } else {
				this.postchongzhi_api();
			}
		  
		  // #endif
		  // 支付后关闭弹窗
		  //this.close();
    },
	// h5微信提交打赏
	postdashang_api(){
		var duixin = this; 
		let uid = this.$store.state.memberuid;
        let keycode = this.$store.state.keycode;
		if(this.mark == 'tie'){
	        var mark = "my-dashang_tie-"+this.id;
        } else {
        	var mark = "my-dashang_ping-"+this.pinglun_id;
        }

		var urldata = "is_ajax=1&pay[money]=" + this.calculatedAmount + "&pay[type]=weixin&pay[is_xcx]=1&h5=1&pay[mark]="+mark;
		// #ifdef MP
		var postPayidRequest = postRequest(Api.postPay(uid,keycode),urldata);
		// #endif
		// #ifdef H5
		var postPayidRequest = postRequest(Api.postPay(uid,keycode),urldata);
		// #endif
		postPayidRequest.then(response => {
			//console.log('支付weixin',response); 
			if (response.data.code) {
				var h5datas = "is_ajax=1&pay[money]=" + this.calculatedAmount + "&pay[type]=weixin&pay[is_xcx]=1&h5=1&pay[mark]="+mark;
				// #ifdef H5
                duixin.getPayzhifu(response.data,h5datas);
                // #endif		
			} else {
				uni.showToast({
					title: response.data.msg,
					icon: 'none'
				});
			} 
		});

	},
	// 拉起支付
	getPayzhifu(data,urldata){
        var duixin = this; 
		// #ifdef MP
        var getPayidRequest = getRequest(Api.getPayid(data.code,urldata));
        // #endif
        // #ifdef H5
        var getPayidRequest = getRequest(Api.getPayid(data.code,urldata));
        // #endif
						getPayidRequest.then(response => {
					//console.log('支付weixin',response); 
					if (response.data.code) {
						// #ifdef H5
							//duixin.getH5payzhifu(response.data.data,urldata);
							duixin.getWeixinMiyueData(response.data.data);
						// #endif
						// #ifdef MP
						// 小程序
						wx.requestPayment({
							"timeStamp": response.data.data.timeStamp,
							"nonceStr": response.data.data.nonceStr,
							"package": response.data.data.package,
							"signType": "MD5",
							"paySign": response.data.data.paySign,
							"success":function(res){
								//duixin.getMemberpay(res);
								//duixin.getu_api();
								const targetUrl = uni.getStorageSync('goumai_jifen_url') || duixin.fanhuiurl;
							},
							"fail":function(res){
								//console.log(res);
								wx.showModal({
									showCancel: false,
									content: res.err_desc+"："+res.errMsg
								})
							}
							
						})
						// #endif
					  //console.log('支付',response.data); 
					  //duixin.quanzishuxing = response.data.data
					} else {
					  uni.showToast({
					  	icon: 'none',
					  	title: response.data.msg,
					  	duration: 1000
					  });
					}
				});

	},
	// h5 微信支付
	async getWeixinMiyueData(data){
				
				var duixin = this;
				// #ifdef H5
				try {
					await this.$ensureWxLoaded();
				} catch (e) {
					console.error('JSSDK加载失败：', e);
					uni.showToast({ title: '微信JSSDK加载失败', icon: 'none' });
					return;
				}
				// #endif
				// #ifdef H5
				const wxRef = window.wx || (window.duixin && window.duixin.$wx);
				if (!wxRef || typeof wxRef.config !== 'function') {
					console.error('微信JSSDK未正确加载：wxRef.config 不可用', wxRef);
					uni.showToast({ title: '微信JSSDK不可用', icon: 'none' });
					return;
				}
				// #endif
				var danqianurls = uni.getLaunchOptionsSync();
				//var danqianurls = '/'+danqianurls.path+'?id='+danqianurls.query.id;
				var danqianurls = '/'+danqianurls.path;
				
				const url = decodeURIComponent(window.location.href);
				var urljia = danqianurls;
				
				var getWeixinmiyueRequest = getRequest(Api.getWeixinfengxiangmiyue(url));
				 
				getWeixinmiyueRequest.then(response => {
					
					if (response.data.code == 1) {
						
						var weixin = response.data.data;
						//console.log('充值H5weixin',weixin);
						wxRef.config({
						  debug: false,//true
						  appId: weixin.appId,
						  timestamp: weixin.timestamp,
						  nonceStr: weixin.nonceStr,
						  signature: weixin.signature,
						  jsApiList: [
						    // 所有要调用的 API 都要加到这个列表中
						    
						    // 这里需要自己按微信文档来写参数
						    "updateAppMessageShareData", 
							"updateTimelineShareData",
							'checkJsApi', //判断当前客户端版本是否支持指定JS接口  
							'onMenuShareAppMessage', //分享接口  
							'getLocation', //获取位置  
							'openLocation', //打开位置  
							'scanQRCode', //扫一扫接口  
							'chooseWXPay', //微信支付  
							'chooseImage', //拍照或从手机相册中选图接口  
							'previewImage', //预览图片接口  
							'uploadImage' //上传图片  
						  ]
						});
						wxRef.ready(function () {
							//duixin.getPayzhifu(dataa,datab);
							//console.log('支付data',data); 
							
							// config信息验证后会执行ready方法，所有接口调用都必须在config接口获得结果之后，config是一个客户端的异步操作，所以如果需要在页面加载时就调用相关接口，则须把相关接口放在ready函数中调用来确保正确执行。对于用户触发时才调用的接口，则可以直接调用，不需要放在ready函数中。
							wxRef.checkJsApi({
								jsApiList: ['chooseWXPay'], // 需要检测的JS接口列表，所有JS接口列表见附录2,
								success: (res) => {
								//console.log('支付res',res); 
								
							}
							});
							// 调用微信支付接口
							wxRef.chooseWXPay({
								timestamp: data.timeStamp,    // 时间戳
								nonceStr: data.nonceStr,      // 随机串
								package: data.package,        // 订单详情扩展字符串
								signType: 'MD5',                // 签名方式
								paySign: data.paySign,           // 签名
								success: (res) => {
									// 支付成功后的回调函数
									//duixin.getMemberpay(res);
									// 弹出提示支付成功
									uni.showToast({
                                    	title: '打赏成功',
                                    	icon: 'success'
                                    });
                                    this.getUidlist();
                                    this.close();
									/*if(duixin.fanhuiurl){
									    uni.reLaunch({ url: duixin.fanhuiurl });
									}*/
								},
								fail: (res) => {
									// 支付失败后的回调函数
									console.error('Payment failed', res);
									
								}
							})
							
						});
						wxRef.error(function(res){
						  //console.log('weixinres',res); 
						});
					} else {
					    duixin.setData({
							displaySwiper: "none"
					    });
					}
				});
			},

    // 双击清除输入金额
    clearInputAmount() {
      this.inputAmount = '';
    },
    // 选择打赏金额
    selectAmount(amount) {
      this.inputAmount = amount.toString();
      // 更新提示信息
      if(this.mark == 'tie'){
        this.zhifu_tishi = '打赏' + amount + '元';
      } else if(this.mark == 'ping'){
        this.zhifu_tishi = '打赏' + amount + '元';
      } else {
        this.zhifu_tishi = '打赏' + amount + '元';
      }
    },
	postchongzhi_api() {
		// 从Vuex store中获取登录会员信息
		const uid = this.$store.state.memberuid;
		const keycode = this.$store.state.keycode;
		const member = this.$store.state.member;
        
		// 检查是否已登录
		if (!uid || !keycode) {
			uni.showToast({
				icon: 'none',
				title: '请先登录',
				duration: 1000
			});
			return;
		}
		if(this.mark == 'tie'){
			var mark = "my-dashang_tie-"+this.id;
			if(this.quanid){
				//this.getPay_jilu(this.mark,this.quanid);
			}
			
			//var mark = this.mark;
		} else {
			var mark = "my-dashang_ping-"+this.pinglun_id;
		}
			//console.log('this.calculatedAmount',this.calculatedAmount); 
			// is_form
		let datas = "&is_form=1&pay[uid]="+uid+"&pay[keycode]="+keycode+"&pay[type]="+this.payType+"&pay[money]="+this.calculatedAmount+"&pay[mark]="+mark;
		// 加入支付数据库id后，读取提交的支付id
		if (this.payid) {
			datas += "&pay[id]=" + this.payid;
		}
		//console.log('response信的id11111',this.payid);
		if (this.payid) {
			this.getzhifu(this.payid);
			return;
		}
		postPayRequest = '';
		if(this.mark){
		    var postPayRequest = postRequest(Quan_Api.post_payid(uid,keycode), datas);
		} else {
			var postPayRequest = postRequest(Api.postweixin_chongzhi(uid,keycode), datas);
		}
		postPayRequest.then(response => {
				if (response.data.code) {
					// 打印
					//console.log('response信的id',response.data && response.data.data.id);
					var id ='';
					if(this.payid){
						var id = this.payid;
						this.getzhifu(id);

					} else {
						var id = response.data && response.data.data.id;
						this.getzhifu(id);
					}
					
					//console.log('id新从id ',this.payid);
					this.getzhifu(id); // 拉起支付 第二步骤
				} else {
					this.cuowu = true;
					this.cuowu_tishi = response.data.msg;
					//console.log('id新从id ',response.data.msg);
					uni.showToast({
						icon: 'none',
						title: response.data.msg,
						duration: 1000
					});
				}
			});

	},
	// 创建支付订单
	getPay_jilu(mark,quanid){
		var uid = this.uid;
		var keycode = this.keycode;
		var getPayidRequest = getRequest(Quan_Api.getPay_jilu(uid,keycode,mark,quanid));
	},
	// 拉起已经存在的支付订单
	get_payid(id){
		var money = this.jine;
		var h5datas = "is_ajax=1&pay[mark]=recharge&pay[money]=" + money + "&pay[type]=weixin&pay[is_xcx]=1&h5=1";
		var datas = "is_ajax=1&pay[mark]=recharge&pay[money]=" + money + "&pay[type]=weixin&pay[is_xcx]=1";
		// #ifdef MP
		var getPayidRequest = getRequest(Api.getPayid(id,datas,uid,keycode));
		// #endif
		// #ifdef H5
		var getPayidRequest = getRequest(Api.getPayid(id,h5datas,uid,keycode));
		// #endif
		

	},
	//拉起支付 第二步骤
	getzhifu(id){
		// 从Vuex store中获取登录会员信息
		const uid = this.$store.state.memberuid;
		const keycode = this.$store.state.keycode;
		// 充值订单
		var get_data = getRequest(Api.getZhifu(uid,keycode,id));
		var res;
		get_data.then(duixin_data => {
			res = duixin_data;
			if(res.data.code) {
				var erweima = res.data.data && res.data.data.code;
				this.erweima = erweima;
				// 加入支付数据库id后，读取提交的支付id
				this.getjiance_zhifu_api(id);
				
			}else{
				uni.showToast({
					icon: 'none',
					title: res.data.msg,
					duration: 1000
				});
			}
		});
	
	},
	// 微信JSAPI支付
	
	// 查询支付结果（轮询） 第三步骤
	getjiance_zhifu_api(id) {
		// 清除之前可能存在的定时器
		if (this.queryInterval) {
			clearInterval(this.queryInterval);
		}
		
		let queryCount = 0;
		const maxCount = 60; // 最多查询60次（约3分钟）
		
		this.queryInterval = setInterval(() => {
			queryCount++;
			// 调用查询支付结果的接口
			// 这里需要根据实际项目的接口进行调整
			const uid = this.$store.state.memberuid;
			const keycode = this.$store.state.keycode;
			//var get_data = getRequest(Api.getZhifu(uid,keycode,id));
			const queryUrl = Api.getZhifujiance(uid, keycode, id);
			
			getRequest(queryUrl).then(res => {
				if(res.data.code == 1) {
					// 支付成功
					clearInterval(this.queryInterval);
					this.queryInterval = null;
					uni.showToast({
						title: '打赏成功',
						icon: 'success'
					});
					this.getUidlist();
					this.close();
					// 刷新会员信息
					// 尝试通过事件通知父组件刷新用户信息
					this.$emit('uidapi');
					this.$emit('tieapi');
					
					
				} else if(queryCount >= maxCount) {
					// 查询超时
					clearInterval(this.queryInterval);
					this.queryInterval = null;
					uni.showToast({
						icon: 'none',
						title: '支付超时，请重新尝试',
						duration: 1500
					});
				}
			});
		}, 3000); // 每3秒查询一次
	},
	getDashang(){
		var uid = this.uid;
		var keycode = this.keycode;
		var getDashangRequest = getRequest(Dashang_Api.getDashang_shezhi());
		getDashangRequest.then(res => {
			if(res.data.code == 1) {
				this.dashang = res.data.data; //打赏设置数据
				var dashang = res.data.data; //打赏设置数据
                this.rewardAmounts = this.dashang.s; // 转换为数组
				this.$emit('app_dasahng',dashang);
			} else {
				uni.showToast({
					icon: 'none',
					title: res.data.msg,
					duration: 1000
				});
			}
		});
	},
	getUidlist(){
		var uid = this.uid;
		var keycode = this.keycode;
		var id = this.id;
		var getUidlistRequest = getRequest(Dashang_Api.getUidlist(id));
		getUidlistRequest.then(res => {
			if(res.data.code == 1) {
				this.uidlist = res.data.data; //打赏设置数据
				this.$emit('app_dasahng_uid',this.uidlist);
			} else {
				uni.showToast({
					icon: 'none',
					title: res.data.msg,
					duration: 1000
				});
			}
		});
	},

  }
}
</script>

<style>
    .warp {
		display: flex;
		align-items: center;
		justify-content: center;
		height: 100%;
	}

	.rect {
		width: 500rpx;
		background-color: #fff;
		border-radius: 10rpx;
		padding: 40rpx;
		box-sizing: border-box;
		position: relative; /* 相对定位，作为浮动元素的父容器 */
		padding-top: 60rpx; /* 增加顶部内边距，为漂浮图片留出空间 */
	}

	.title {
		font-size: 36rpx;
		font-weight: bold;
		text-align: center;
		margin-bottom: 30rpx;
		margin-top: 30rpx; /* 为了给漂浮图片留出空间 */
	}
	
	/* 漂浮图片样式 */
	.floating-image {
		position: absolute;
		top: -40rpx; /* 向上偏移，使其部分在rect上方 */
		left: 50%;
		transform: translateX(-48%); /* 水平居中 */
		z-index: 10; /* 确保在rect上方 */
		border-radius: 2%; /* 可选：圆形效果 */
		/*box-shadow: 0 0 10rpx rgba(0, 0, 0, 0.2);*/ /* 可选：阴影效果 */
		/*background-color: #ddd;*/
	}

	.amount-buttons {
		display: flex;
		flex-direction: column;
		gap: 20rpx;
		margin-bottom: 30rpx;
	}
	
	.amount-row {
		display: flex;
		justify-content: space-between;
		gap: 20rpx;
	}
	
	.amount-button {
		flex: 1;
		text-align: center;
		padding: 20rpx;
		border: 1px solid #ddd;
		border-radius: 8rpx;
		font-size: 28rpx;
		color: #333;
		transition: all 0.3s;
	}
	
	.amount-button.active {
		background-color: #e64340;
		color: #fff;
		border-color: #e64340;
	}
	
	.amount-button:active {
		opacity: 0.8;
	}
	
	.input-container {
		display: flex;
		justify-content: center;
		align-items: center;
		margin-bottom: 30rpx;
		font-size: 28rpx;
	}

	.input-container text {
		margin-right: 10rpx;
	}

	.amount {
		font-size: 48rpx;
		color: #e64340;
		text-align: center;
		margin-bottom: 30rpx;
	}

	.pay-type {
		font-size: 28rpx;
		color: #666;
		text-align: center;
		margin-bottom: 40rpx;
	}
	.pay-type-hongse {
		font-size: 28rpx;
		color: #fd5d5d;
		text-align: center;
		margin-bottom: 40rpx;
	}

	.buttons {
		display: flex;
		flex-direction: column;
		gap: 20rpx;
	}

	uv-button {
		width: 100%;
	}
</style>